<template>
  <view class="orderDetails_">
    <view class="main_wrapper">
      <view class="addressa_" @tap.stop="orderFn">
        <view class="left_">
          <view class="info_1">
            <view class="info_name" v-if="addressType"
              >{{ defaults[0].consigneeName }}
            </view>
            <view class="info_phone" v-if="addressType"
              >{{ defaults[0].consigneeMobile }}
            </view>
            <!--          没有地址的时候显示  -->
            <view v-if="!addressType">请选择收货地址</view>
          </view>
          <view class="info_2" v-if="addressType && checkedzt==false"
            >{{
              defaults[0].consigneeProvince +
              defaults[0].consigneeCity+
              defaults[0].consigneeArea +
              defaults[0].consigneeAddress
            }}
          </view>
          <!--         没有地址信息的时候显示 -->
          <view class="info_2" v-if="!addressType">暂无收货信息</view>
        </view>
        <view class="right_">
          <image src="/static/orderDetails/1.png"></image>
        </view>
		<view class="buttonselect_" v-if="addressType">
			<!-- <view class="ztlist_"  @tap.stop="ztChangetag"  @tap.stop.prevent>
				<view class="checkBox_">
				 <u-checkbox-group
				   shape="circle"
				   active-color="red"
				 >
				   <u-checkbox v-model="checkedzt" @change.stop="ztChange" @tap.stop.prevent></u-checkbox>
				  </u-checkbox-group>
				 </view>
				<view class="title_">
					<text>自提</text><text class="titlesm_">*自主选择到店自提</text>
				</view>
				
				
				
			</view> -->
			
		</view>
		<image src="/static/orderDetails/3.png" class="img_"></image>
		
      </view>
	  
      <!--     我的订单 -->
      <view class="order_info_wrapper">
        <!--        <view class="header_">-->
        <!--          <image src="/static/order/2.png"></image>-->
        <!--          <text>普通订单</text>-->
        <!--        </view>-->
        <view class="order_item" v-for="(item,index) in optionsOrder">
          <view class="item_wrapper">
            <image :src="httpUrlFn(item.goodsImage)" />
            <view class="right_">
              <view class="right_1">
                <view>{{ item.goodsName }}</view>
                <view
                  >￥
                  <text>{{ item.goodsPrice }}</text>
                </view>
              </view>
              <view class="right_2">
              <!--  <view class="item_1">
                  共：￥{{item.goodsPrice*item.goodsNum}}
                </view> -->
                <!--                <view class="item_2">佣金:￥<text>100</text></view>-->
              </view>
              <view class="right_3">
                <view>
                  <text 
                    >{{item.goodsSpec}}</text
                  >
                </view>
                <view>x{{ item.goodsNum }}</view>
              </view>
            </view>
          </view>
        </view>
		
		
        <view class="money_wrapper">
          <view>
            <view>共{{ paynum }}件</view>
            <text>商品小计：</text>
			<!-- <text v-if="optionsOrder.orderType==2">随机减免：</text> -->
            <text class="money_">￥{{ payPrice }}</text>
          </view>
        </view>
      </view>
      <!--     随机减免 -->
           <view class="random_" v-if="optionsOrder.orderType==2&&randomDerateParams!==0">
             <view>随机减免</view>
             <view>-￥{{randomDerateParams}}</view>
           </view>
      <!--    运费和订单备注  -->
      <view class="freight_">
        <view>
          <view>运费</view>
          <view>包邮</view>
        </view>
       <!-- <view class="order_" @tap="gotinfo">
          <view>填写个人信息</view>
        
          
        </view> -->
		<view @tap="gotinfo">
		  <view >填写个人信息(<text :class="fromdata.idCardNo?'':'test-color'"> {{fromdata.idCardNo?"已填写":"未填写"}}</text>)</view>
		  <view>{{fromdata.idCardNo?"去修改":"去填写"}}></view>
		</view>
		<view class="order_">
		          <view>订单备注</view>
		          <view>
		            <u-input
		              placeholder-style="text-align: right;"
		              v-model="orderNotes"
		              :type="'text'"
		              placeholder="选填，请先和商家协商一致"
		              class="input_"
		            />
		          </view>
		        </view>
      </view>
	  
	  
	  <view class="formdata">
	  	<u-form :model="form" ref="uForm">
	  			
	  			<u-form-item label="诊断证明" label-width="150" prop="diagnosProve">
	  				<u-upload :action="action" width="150" height ="150" upload-text='请上传'
	  				 :max-count="1" 
					 :before-upload="beforeUpload"
					 :form-data="udformdata" 
					 :show-progress="false"
	  				 @on-success="onsuccessfront"
	  				 @on-remove="onremovefront"
	  				></u-upload></u-form-item>
	  			<u-form-item label="医生处方" label-width="150" prop="prescribe">
	  				<u-upload :action="action"  width="150" height ="150" upload-text='请上传' 
	  				 :max-count="1"  :form-data="udformdata" 
					 :before-upload="beforeUpload"
	  				 @on-success="onsuccessback"
	  				 @on-remove="onremoveback"
	  				  :show-progress="false"
	  				></u-upload></u-form-item>
	  		</u-form>
	  </view>
	 
      <!--     余额 -->
      <!--     随机减免 -->
	  <view class="paytype_">
	  	支付方式
	  </view>
      <view class="balance_" @tap.stop="checkBoxFn(0,item)" v-for="(item,index) in paydatelist" :key="index" v-if="item.type==1">
        <view class="image_ ">
          <image src="/static/withdrawal/4.png"></image>
          <view 
            >微信支付
            </view
          >
        </view>
         <view class="checkBox_">
          <u-checkbox-group
            @change="checkboxGroupChange(0)"
            shape="circle"
            active-color="red"
          >
            <u-checkbox @change="checkboxChange(0)" v-model="checked"></u-checkbox>
           </u-checkbox-group>
          </view>
        </view>
		<!-- <view class="balance_" @tap.stop="checkBoxFn(1)">
		  <view class="image_">
		    <image src="/static/orderDetails/balance.png"></image>
		    <view
		      >余额支付
		      <view
		        >￥ <text>{{ userInfoServer.usableMoney || 0 }}</text></view
		      ></view
		    >
		  </view>
		   <view class="checkBox_">
		    <u-checkbox-group
		      @change="checkboxGroupChange(1)"
		      shape="circle"
		      active-color="red"
		    >
		      <u-checkbox @change="checkboxChange(1)" v-model="checkedyd"></u-checkbox>
		     </u-checkbox-group>
		    </view>
		  </view> -->
    </view>
    <!--   按钮 -->
    <view class="footer_wrapper">
      <view class="but_wrapper">
        <view>
          <view class="money_">
            合计：
            <view
              >￥
              <!-- <text v-if="optionsOrder.orderType==2">{{   optionsOrder.payMoney-randomDerateParams<0?0: Number(optionsOrder.payMoney-randomDerateParams).toFixed(2)}}</text>
			   -->
			   <!-- <text v-if="optionsOrder.orderType==2">{{   optionsOrder.payMoney-randomDerateParams<0?0: Subtr(optionsOrder.payMoney,randomDerateParams)}}</text> -->
			 <text >{{ payPrice}}</text>
			 
            </view>
          </view>
          <view class="submit_order" @tap.stop="submitFn">提交订单</view>
        </view>
      </view>
    </view>
    <u-toast ref="uToast" />
    <u-modal
      v-model="showModel"
      @confirm="confirm"
      title="温馨提示"
      ref="uModal"
      :async-close="true"
      :content="showModelContent"
      :show-cancel-button="true"
    ></u-modal>
  </view>
</template>

<script>
import { randomDerate, selAddrApi, surplusPay } from "@/api/address";
import { getConsigneeInfo } from "@/api/address";
import {getPayList,savePreOrder,payOrderCallbackTest, placeOrder, weixinPay } from "@/api/orderApi";
import { BASE_URL_IMAHE,BASE_URL } from "../../../../utils/https";
import { getUserByIdApi } from "@/api/login/login";

export default {
  name: "index.vue",
  data() {
    return {
		
		// companylist: [
		// 				{
		// 					name: 'XH',
		// 					disabled: false
		// 				},
		// 				{
		// 					name: 'XH',
		// 					disabled: false
		// 				},
		// 				{
		// 					name: 'XH',
		// 					disabled: false
		// 				}
		// ],
		// // u-radio-group的v-model绑定的值如果设置为某个radio的name，就会被默认选中
		// company: 'XH',
      //余额状态
      checked: true,
	  checkedyd:false,
	  // 是否自提
	  checkedzt:false,
      //订单备注
      orderNotes: "",
      timestamp: 3,
      showModel: false,
      showModelContent: "是否确定提交订单？",
      //普通订单传递的
      optionsOrder: {},
      //用户ID
      userId: "",
      //地址
      addressType: false,
      //默认地址
      defaults: [],
      //微信支付参数
      weixinOrder: {},
      userInfoServer: "",
	  // 减免金额
	  randomDerateParams:0,
	  randomDerateParamsnum:0,
	 
	  payPrice:0,
	  paynum:0,
	  fromdata:{
		  idCardNo:"",
	  },
	  token:'',
	  form:{},
	  action: BASE_URL+'/api/ln/saveFileUploads',
	  rules: {
	  				diagnosProve: [
	  					{
	  						required: true,
	  						message: '请上传诊断证明',
	  						trigger: ['blur', 'change']
	  					}
	  				],prescribe: [
	  					{
	  						required: true,
	  						message: '请上传医生处方',
	  						trigger: ['blur', 'change']
	  					}
	  				]
	  			},
	  udformdata:{
		  userId:''
	  },
	  paydatelist:[],
	  ispayid:""
	  
    };
  },
  async onLoad(options) {
	  console.log(options)
    console.log(options,JSON.parse(options.orderList), "提交订单");
	this.udformdata.userId=uni.getStorageSync("userId")
	
	if(options.idCard){
		this.fromdata=JSON.parse(options.idCard)
	}
	var sjs=this.randomWord()
	var datatime = Date.parse(new Date());
	this.token=''+sjs+''+datatime
	this.getPayListfun()
	
    this.optionsOrder = JSON.parse(options.orderList);
	this.payPrice=options.payPrice
	this.randomDerateParams=this.getrandom()
	this.randomDerateParamsnum=this.randomDerateParams
	this.optionsOrder.forEach((item)=>
	 this.paynum+=item.goodsNum
	)
	
	if (uni.getStorageSync("userId")) {
	  //地址管理
	  const res = await getConsigneeInfo({userId:uni.getStorageSync("userId")});
	  if (res.result == 0) {
	    if (res.consigneeInfoList.length === 0) {
	      this.addressType = false;
	    } else {
	      if (res.consigneeInfoList.length !== 0) {
	        const defaults = res.consigneeInfoList.filter((item) => {
	          return item.defaultFlag == 1;
	        });
	        if (defaults.length == 0) {
	          this.defaults.push(res.consigneeInfoList[0]);
	        } else {
	          this.defaults = defaults;
	        }
	        console.log(defaults, "默认地址");
	      }
	
	      this.addressType = true;
	    }
	  } else {
	    uni.showToast({
	      title: "获取地址失败！",
	      icon: "error",
	      duration: 2000,
	    });
	  }
	}
  },
 onShow() {
    
  },
  onReady() {
  		this.$refs.uForm.setRules(this.rules);
  	},
  methods: {
	 async getPayListfun(){
		  
		  const res = await getPayList();
		  console.log(res,"支付列表")
		  if(res.result==0){
			 this.paydatelist=res.payList
				 
			 if(this.paydatelist[0].type==1){
				 this.checked=true
				 this.checkedyd=false
			 }else{
				 this.checked=false
				 this.checkedyd=true
			 }
			 this.ispayid=this.paydatelist[0].id
			 
		  }
		  
	  },
	  beforeUpload(index, list){
	  	console.log("e")
	  	uni.showLoading({
	  		title:"上传中",
	  		mask:true,
	  		
	  	})
	  	
	  },
	   onsuccessfront(data, index,lists,name){
	  	console.log(data,index,lists,name)
	  	this.form.diagnosProve=data.fileUrls[0]
	  },
	  onsuccessback(data, index,lists,name){
	  	console.log(data,index,lists,name)
	  	this.form.prescribe=data.fileUrls[0]
	  	
	  },
	  onremovefront(index, lists, name){
	  	console.log(index,lists,name)
	  	this.form.diagnosProve=""
	  },
	  onremoveback(index, lists, name){
	  	console.log(index,lists,name)
	  	this.form.prescribe=""
	  },
	  
	  selectaddress(item){
		  let that = this;
		  // let car_obj = carobj;
		  if(item){
			  this.defaults=[]
			  this.addressType = true;
			  this.defaults.push(item)
			  
		  }
		 
	  },
	  
	  Backcardata(carobj) {
	  				let that = this;
	  				let car_obj = carobj;//这个地方可以不写 下面直接用 carobj，我是因为其他原因替换一下
	  				// console.log("1111");
	  				// console.log(carobj);
	  				//这个地方先判断传递过来的参数有没有内容
					
	  				if (car_obj) {
						this.fromdata={...this.fromdata,...carobj}
						console.log(this.fromdata)
	  					console.log('这是传递过来的车辆信息',
	  						car_obj);
	  				} 
	  			},
	  
	  gotinfo(){
		  uni.navigateTo({
		  	url:"/pages/subpackage/info/index?item="+JSON.stringify(this.fromdata)
		  })
	  },
	 
	getrandom(){
		
		let num=Math.random()*0.88
		if(num===0){
			console.log(num,'num')
			return this.getrandom()
		}else{
			return Math.floor(num*100)/100
		}
		
	  },
    //更新用户等级数据
    async userList() {
      if (uni.getStorageSync("token")) {
        const res = await getUserByIdApi();
        if (res.code === 0) {
          this.userInfoServer = res.data;
          uni.setStorageSync("userInfoServer", res.data);
          //关闭加载动画
          uni.stopPullDownRefresh();
          uni.hideLoading();
        }
      } else {
        //关闭加载动画
        uni.stopPullDownRefresh();
        uni.hideLoading();
      }
    },

    httpUrlFn(item) {
       return BASE_URL_IMAHE + item;
    },

    checkBoxFn(index,item) {
      // this.checked = !this.checked;
      // console.log(this.checked, "fuck");
	  this.selecheck(index)
	  this.ispayid=item.id
	  
	  
    },
	
	
	ztChangelistt(index){
		console.log('checkedzt3')
		 this.checkedzt=!this.checkedzt
	},
	ztChangetag(){
		console.log('checkedzt2')
		 this.checkedzt=!this.checkedzt
	},
	ztChange(index){
		console.log('checkedzt1')
		// return
	  this.checkedzt=!this.checkedzt
	},
	selecheck(index){
		if(index===0){
				  if(!this.checked&&!this.checkedyd){
					  this.checked=true
					  this.checkedyd=false
					  this.randomDerateParams=0
					  
				  }else{
					  if(this.checked){
						  return
					  }else{
						  this.checked = !this.checked;
						  this.checkedyd = !this.checkedyd;
						  
						  this.randomDerateParams=this.randomDerateParamsnum
					  }
					 
				  }
				  
		}else{
				  if(!this.checked&&!this.checkedyd){
				  			  this.checked=false
				  			  this.checkedyd=true
							  this.randomDerateParams=this.randomDerateParamsnum
							  
				  			  
				  }else{
				  			  if(this.checkedyd){
				  				  return
				  			  }else{
				  				  this.checked = !this.checked;
				  				  this.checkedyd = !this.checkedyd;
								  
								  this.randomDerateParams=0
				  			  }
				  			 
				  }
		}
		// console.log(this.randomDerateParams,"this.randomDerateParams")
	},
	

    // 选中某个复选框时，由checkbox时触发
    checkboxChange(index) {
		this.selecheck(index)
      // console.log(e, "111");
      // console.log(this.checked, "checked11");
    },
    // 选中任一checkbox时，由checkbox-group触发
    checkboxGroupChange(index) {
      console.log(index, "----22");
	  this.selecheck(index)
	 
      
      // console.log(this.checked, "checked22");
    },

    //地址
    orderFn() {
		if (this.checkedzt) {
			return
		}
      if (!this.addressType) {
        uni.navigateTo({
          url: "/pages/subpackage/address/index?type=1",
        });
      } else {
        uni.navigateTo({
          url: "/pages/subpackage/addressManagement/index?type=1",
        });
      }
    },

    //提交订单
    submitFn() {
      console.log("提交订单");
      console.log(this.defaults, "this.defaults");
	  let isshow=false
	  var that=this
	  		
			if(this.fromdata.idCardNo==""){
				this.$refs.uToast.show({
				  title: "您还没添加个人信息，请先添加!",
				  type: "error",
				});
				return
			}
			this.$refs.uForm.validate(valid => {
				if (valid) {
					console.log('验证通过');
					isshow=true
				} else {
					isshow=false
					console.log('验证失败');
				}
			});
			
			if(!isshow){
				return
			}
			
      if (this.optionsOrder) {
        if (this.defaults.length === 0) {
          this.$refs.uToast.show({
            title: "您还没添加地址，请先添加!",
            type: "error",
          });
        } else {
          this.showModel = true;
		  
        }
      } else {
        this.$refs.uToast.show({
          title: "参数有误,提交识别!",
          type: "error",
        });
        uni.navigateBack({
          delta: 1,
        });
      }
    },
   Subtr(arg1,arg2){ 
     var r1,r2,m,n; 
     try{r1=arg1.toString().split(".")[1].length}catch(e){r1=0} 
     try{r2=arg2.toString().split(".")[1].length}catch(e){r2=0} 
     m=Math.pow(10,Math.max(r1,r2)); 
     n=(r1>=r2)?r1:r2; 
     return ((arg1*m-arg2*m)/m).toFixed(n); 
   },
    //确定提交订单
    async confirm() {
		
		
		var goodid=""
		this.optionsOrder.forEach((element)=>{
			// console.log("-----",goodid)
			if(goodid==""){
				goodid=element.id
			}else{
				goodid+=','+element.id
			}
		})
		

      const order = {
        userId: uni.getStorageSync("userId"),
        v: uni.getStorageSync("v"),
        token: this.token,
		payId:this.ispayid,
        goodsCarIds: goodid,
		consigneeProvince:this.defaults[0].consigneeProvince,
		consigneeCity:this.defaults[0].consigneeCity,
		consigneeArea:this.defaults[0].consigneeArea,
        consigneeAddress:this.defaults[0].consigneeAddress,
		consigneeName:this.defaults[0].consigneeName,
		consigneeMobile:this.defaults[0].consigneeMobile,
        idCardNo:this.fromdata.idCardNo,
        idCardFront:this.fromdata.idCardFront,
        idCardBack:this.fromdata.idCardBack,
        diagnosProve:this.form.diagnosProve,
        prescribe:this.form.prescribe,
        //订单备注
        orderRemarks: this.orderNotes,
      };

	 
      const res = await savePreOrder(JSON.stringify(order));

      console.log(res, "下单接口");
      if (res.result == 0) {
       
        this.showModel = false;
		
		if(this.checked){
			this.paydatelist.forEach((element,index)=>{
				if(element.type==1){
					if(element.company=="APG"){
						window.location.href = res.payUrl;
						 // uni.reLaunch({
							// 	    url: "/pages/subpackage/orderpay/index",
							// 	  });
					}
					if(element.company=="XH"){
						window.location.href = res.payUrl;
						 uni.reLaunch({
								    url: "/pages/subpackage/order/index?status=0",
								  });
					}
					  }
			})
			
		}
		
	
      
			
		}else{
			uni.showToast({
			  title: "下单失败",
			  icon: "error",
			  duration: 2000,
			});
			this.showModel = false;
			return;
		}

        
      console.log(order, "提交订单");
    },
	randomWord() {
	    var chars = ['0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'I', 'J', 'K', 'L', 'M', 'N', 'O', 'P', 'Q', 'R', 'S', 'T', 'U', 'V', 'W', 'X', 'Y', 'Z', 'a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j', 'k', 'l', 'm', 'n', 'o', 'p', 'q', 'r', 's', 't', 'u', 'v', 'w', 'x', 'y', 'z'];
	     var nums = "";
	      for (var i = 0; i < 20; i++) {
	      var id = parseInt(Math.random() * 61);
	      nums += chars[id]
	      }
	      return nums; 
	      },
  },
};
</script>

<style scoped lang="scss">
.orderDetails_ {
  //background: #F5F5F5;
  height: 100vh;
  //background: pink;
  > .main_wrapper {
    background: #f5f5f5;
    margin: rpx(0) rpx(12) rpx(16);
    display: flex;
    flex-direction: column;
    padding-bottom: rpx(68);

    > .addressa_ {
      margin-top: rpx(12);
      width: 100%;
      display: flex;
      background: #ffffff;
      border-radius: rpx(5);
      align-items: center;
      justify-content: space-between;
	  flex-wrap: wrap;
      padding: rpx(12) rpx(12) rpx(16) rpx(12);
      position: relative;
	  
	  >.buttonselect_{
		  width: 100%;
		  
		  > .ztlist_{
			  width: rpx(327);
			  box-sizing: border-box;
			  display: flex;
			  justify-content: left;
			  align-items: center;
			  height: rpx(15);
			  // padding-left: rpx(8);
			  padding-right: rpx(8);
			  border-radius: rpx(5);
			  font-weight: bold;
			  font-size: rpx(13);
			  margin-top: rpx(12);
			  > .title_{
				  margin-left: rpx(5);
				  >.titlesm_{
					  margin-left: rpx(5);
					  color: #FA9D3B;
					  font-weight: normal;
				  }
			  }
			  
			  > ::v-deep .checkBox_ {
			    display: flex;
			    align-items: center;
			    justify-content: center;
			    .u-checkbox__label {
			      margin: 0;
			    }
			  }
		  }
		  
	  }

      > .left_ {
        display: flex;
        flex-direction: column;
        font-size: rpx(15);
        font-weight: 400;
        color: #353535;

        .info_1 {
          display: flex;
          margin-bottom: rpx(4);

          > .info_name {
            margin-right: rpx(10);
          }
        }

        .info_2 {
          font-size: rpx(13);
          font-weight: 400;
          color: #b2b2b2;
        }
      }

      > .right_ {
        > image {
          width: rpx(16);
          height: rpx(16);
          vertical-align: middle;
        }
      }

      > .img_ {
        width: rpx(339);
        height: rpx(2);
        vertical-align: middle;
        position: absolute;
        bottom: 0;
        left: rpx(6);
        right: rpx(6);
      }
    }

    > .order_info_wrapper {
      margin-top: rpx(8);
      padding: rpx(16) rpx(12);
      width: rpx(351);
      //height: rpx(264);
      background: #ffffff;
      border-radius: rpx(5);

      > .header_ {
        > image {
          width: rpx(14);
          height: rpx(14);
          vertical-align: middle;
          margin-right: rpx(4);
        }

        > text {
          font-size: rpx(13);
          font-weight: 400;
          color: #353535;
        }
      }

      > .order_item {
        padding-bottom: rpx(8);
        border-bottom: rpx(1) solid #efefef;

        > .item_wrapper {
          padding: rpx(8) rpx(0);
          display: flex;

          > image {
            width: rpx(72);
            height: rpx(72);
			border-radius: rpx(10);
            vertical-align: middle;
          }

          > .right_ {
            margin-left: rpx(6);
            flex: 1;
            display: flex;
            flex-direction: column;
            justify-content: space-between;

            > .right_1 {
              display: flex;
              justify-content: space-between;

              view:first-child {
                font-size: rpx(12);
                font-weight: 400;
                color: #353535;
                overflow: hidden;
                display: -webkit-box;
                -webkit-box-orient: vertical;
                -webkit-line-clamp: 2; /*最大行数*/
              }

              view:last-child {
                font-size: rpx(12);
                font-weight: bold;
                color: #353535;
                margin-left: rpx(32);
              }
            }

            > .right_2 {
              display: flex;
              margin-top: rpx(2);
              margin-bottom: rpx(4);

              > .item_1 {
                background: #ff421c;
                border-radius: rpx(2);
                padding: rpx(1) rpx(3);
                font-size: rpx(10);
                font-weight: 400;
                color: #ffffff;
                margin-right: rpx(6);
              }

              > .item_2 {
                padding: rpx(1) rpx(3);
                //height: rpx(16);
                background: rgba(250, 81, 81, 0.1);
                border-radius: rpx(2);
                border: rpx(1) solid #fa5151;
                font-size: rpx(10);
                font-weight: 400;
                color: #fa5151;
              }
            }

            > .right_3 {
              display: flex;
              justify-content: space-between;
              font-size: rpx(12);
              font-weight: 400;
              color: #888888;
            }
          }
        }
      }

      > .money_wrapper {
        display: flex;
        padding: rpx(12) rpx(12) rpx(0);
        color: #353535;
        font-size: rpx(13);

        > view {
          display: flex;
          margin-left: auto;
          align-items: center;

          view:first-child {
            margin-right: rpx(10);
          }

          > .money_ {
            color: #fa5151;
            font-weight: bold;
          }
        }
      }
    }
    > .random_ {
      display: flex;
      justify-content: space-between;
      padding: rpx(16) rpx(12);
      background: #ffffff;
      border-radius: rpx(5);
      margin-top: rpx(8);
      view:first-child {
        font-size: rpx(13);
        font-weight: 400;
        color: #353535;
      }
      view:last-child {
        font-size: rpx(13);
        font-weight: 400;
        color: #fa5151;
      }
    }
    > .freight_ {
      display: flex;
      flex-direction: column;
      background: #ffffff;
      border-radius: rpx(5);
      margin-top: rpx(8);
      padding: rpx(16) rpx(12);

      > view {
        display: flex;
        justify-content: space-between;
        view:first-child {
          font-size: rpx(13);
          font-weight: 400;
          color: #353535;
        }
        &:not(:first-child) {
          margin-top: rpx(16);
        }
        &:first-child {
          view:last-child {
            font-size: rpx(13);
            font-weight: 400;
            color: #353535;
          }
        }
      }

      > view.order_ {
        display: flex;
        align-items: center;

        view:last-child {
          font-size: rpx(13);
          font-weight: 400;
          color: #b2b2b2;
          flex: 1;
          margin-left: rpx(10);
          //.input_::v-deep {
          //  width: 100%;
          //  background-color: red;
          //  input {
          //
          //  }
          //}
        }
      }
    }

    > .balance_ {
      background: #ffffff;
      border-radius: rpx(5);
      padding: rpx(16) rpx(12);
      margin-top: rpx(8);
      display: flex;
      justify-content: space-between;
      align-items: center;
      > .image_ {
        display: flex;
        align-items: center;
        > image {
          margin-right: rpx(6);
          width: rpx(24);
          height: rpx(24);
          vertical-align: middle;
        }
        > view {
          font-size: rpx(13);
          font-weight: 400;
          color: #353535;
          display: flex;
          align-items: center;
          > view {
            font-size: rpx(10);
            margin-left: rpx(5);
            > text {
              font-size: rpx(13);
              color: red;
              font-weight: bold;
            }
          }
        }
      }
      > ::v-deep .checkBox_ {
        display: flex;
        align-items: center;
        justify-content: center;
        .u-checkbox__label {
          margin: 0;
        }
      }
    }

    > .order_number {
      view:first-child {
        view:last-child {
          display: flex;
          align-items: center;

          > image {
            vertical-align: middle;
            width: rpx(14);
            height: rpx(14);
            margin-left: rpx(6);
          }
        }
      }
    }
  }

  > .footer_wrapper {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;

    > .but_wrapper {
      background: #ffffff;
      padding: rpx(12);
      display: flex;
      margin-top: rpx(12);

      > view {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex: 1;

        > .submit_order {
          padding: rpx(10) rpx(60);
          background: #fa5151;
          border-radius: rpx(22);
          font-size: rpx(17);
          font-weight: 400;
          color: #ffffff;
        }

        > .money_ {
          font-size: rpx(12);
          color: #353535;
          display: flex;
          align-items: center;
          font-weight: bold;

          > view {
            font-size: rpx(10);
            font-weight: bold;
            color: #fa5151;

            > text {
              font-size: rpx(15);
              font-weight: bold;
              color: #fa5151;
            }
          }
        }
      }
    }
  }
}
.paytype_{
	margin-top: rpx(16);
	font-size: rpx(15);
	font-weight: bold;
	color: #353535;
	line-height: rpx(18);
}
.formdata{
	background: #ffffff;
	    border-radius: 5px;
	    margin-top: 8px;
	    padding: 16px 12px;
}
.test-color{
	color: #fa5151;
}
</style>